import React, {Component} from 'react';

class Header extends Component {


  onKeyDown = (e) => {
    //  直接提交？
    //  判断keyCode
    if (e.keyCode === 13) {
      this.props.addTodo(e.target.value)
      e.target.value = ''
    }
  }

  render() {
    return (
      <header className="header">
        <h1>todos</h1>
        <input
          className="new-todo"
          placeholder="What needs to be done?"
          autoFocus
          onKeyDown={this.onKeyDown}
        />
      </header>
    );
  }
}

export default Header;
